<!DOCTYPE html>
<script src="../resources/text-based-repaint.js"></script>
<script>
function repaintTest() {
    scroller.style.background = 'green';
}
onload = runRepaintAndPixelTest;
</script>
<style>
#scroller {
    background: red;
    contain: paint;
    border: 10px solid rgba(0, 0, 0, 0.5);
    overflow: scroll;
    width: 200px;
    height: 200px;
}

.spacer {
    height: 300px;
}
</style>
<!-- #scroller has a solid color border-box background which will be painted
  into both the scrolling contents and graphics layers. Both of these should
  be invalidated and repainted when the color changes to green. The border
  should appear dark green. -->
<div id="scroller">
    <div class="spacer"></div>
</div>
